// space
$space-none: 0;
$space-nn: 2px;
$space-mn: 3px;
$space-mnn: 4px;
$space-xs: 5px;
$space-xss: 8px;
$space-sm: 10px;
$space-ssm: 12px;
$space-smm: 15px;
$space-df: 20px;
$space-dff: 25px;
$space-md: 30px;
$space-mdd: 35px;
$space-lg: 40px;
$space-lgg: 45px;
$space-xl: 50px;
$space-xxl: 60px;
$space-sl: 70px;
$space-sxl: 80px;
$space-ssl: 90px;
$space-hun: 100px;

//横向
$box-x-xs: $space-xs;
$box-x-sm: $space-sm;
$box-x-df: $space-smm;
$box-x-md: $space-df;

//纵向
$box-y-xs: $space-xs;
$box-y-sm: $space-xss;
$box-y-df: $space-ssm;
$box-y-md: $space-smm;

$box-xs: $box-y-xs $box-x-xs;
$box-sm: $box-y-sm $box-x-sm;
$box-df: $box-y-df $box-x-df;
$box-md: $box-y-md $box-x-md;

$box-map: (
        xs: $box-xs,
        sm: $box-sm,
        df: $box-df,
        md: $box-md
);

@mixin box-size($size) {
  padding: map-get($box-map, #{$size});
}
